.header
	background-color: $color-header
	.header__logo
		display: -webkit-flex
		display: -moz-flex
		display: -ms-flex
		display: -o-flex
		display: flex
		justify-content: space-between
		align-items: flex-start
		padding-top: 50px
		.header__logo-icon
			width: 70px
			height: 70px
			background-image: url(../img/logo.png)
		.header__close-logo
			width: 24px
			height: 24px
			background-image: url(../img/menu-x.png)
			margin-top: 10px
	.header__navegation
		display: -webkit-flex
		display: -moz-flex
		display: -ms-flex
		display: -o-flex
		display: flex
		justify-content: space-between
		align-items: center
		padding-top: 161px
		font-family: $font-head
		.header__text
			max-width: 474px
			margin: 0
			font-size: 85px
			font-weight: 900
			line-height: 1.18
			text-transform: uppercase
			color: $text-head
		span:nth-child(1)
			font-weight: normal
			text-decoration: line-through
			
		span:nth-child(2)
			padding-left: 200px
			position: relative	
		span:nth-child(2):after
			position: absolute
			content: ''
			width: 241px
			height: 11px
			background-color: $text-head
			display: inline-block
			left: 0
			top: 48%
	.header__link
		width: 71.6%
		min-height: 263px
		ul,li,a,a:hover
			text-decoration: none
			margin: 0
			list-style-type: none
			padding: 0
			color: $text-menu
		ul 
			display: grid
			grid-template-columns: 1fr 1fr
			grid-template-rows: 1fr 1fr
			align-content: space-between
			display: -ms-grid
			-ms-grid-columns: 1fr 1fr
			-ms-grid-rows: 1fr 1fr
			height: 263px
			li
				justify-self: center
				-ms-grid-column-align: center
				a
					font-size: 29px
					font-weight: 600
					text-align: center
					text-transform: uppercase
					line-height: 0.8
					position: relative
					padding-bottom: 19px
					display: flex
					flex-direction: column
				a:after
					content: ''
					width: 55px
					height: 3px
					background-color: $text-menu
					position: absolute
					left: 50%
					bottom: 0
					transform: translateX(-50%)
				a:hover:after
					width: 100%
					transition-duration: 0.5s
				a:hover
					padding-bottom: 19px
			li:nth-child(1) 
				-ms-grid-row: 1
				-ms-grid-column: 1
			li:nth-child(2) 
				-ms-grid-row: 1
				-ms-grid-column: 2
			li:nth-child(3) 
				-ms-grid-row: 2
				-ms-grid-column: 1
			li:nth-child(4) 
				-ms-grid-row: 2
				-ms-grid-column: 2
			li:nth-child(3),li:nth-child(4)
				display: flex
				flex-direction: column
				justify-content: flex-end
	.header__network
		padding-top: 217px
		padding-bottom: 61px
		a
			display: inline-block
			margin-right: 30px
			background-repeat: no-repeat
		.header__twitter
			width: 24px
			height: 20px
			background-image: url(../img/shape-2.png)	
		.header__facebook
			width: 14px
			height: 25px
			background-image: url(../img/shape-3.png)	
		.header__instagram
			width: 25px
			height: 25px
			background-image: url(../img/shape-6.png)
		.header__vimeo
			width: 25px
			height: 22px
			background-image: url(../img/shape-8.png)	
		.header__Behance
			width: 30px
			height: 21px
			background-image: url(../img/shape-7.png)